<template>
  <el-menu
    default-active="1"
    background-color="#2f4056"
    text-color="#fff"
    active-text-color="#5FB878"
    class="leftNav"
    :unique-opened="true"
  >
    <el-submenu index="1">
      <template slot="title"> 用户管理 </template>
      <el-menu-item index="1-1"
        ><router-link :to="{ name: 'UserManage' }"
          >用户列表</router-link
        ></el-menu-item
      >
    </el-submenu>
    <el-submenu index="2">
      <template slot="title"> 社团管理 </template>
      <el-menu-item index="2-1"
        ><router-link :to="{ name: 'ClubManage' }"
          >社团列表</router-link
        ></el-menu-item
      >
    </el-submenu>
    <el-submenu index="3">
      <template slot="title"> 我的主页 </template>
      <el-menu-item index="3-1"
        ><router-link :to="{ name: 'ManagerInfo' }"
          >个人信息</router-link
        ></el-menu-item
      >
      <el-menu-item index="3-2"
        ><router-link :to="{ name: 'AccountSetting' }"
          >账号管理</router-link
        ></el-menu-item
      >
    </el-submenu>
  </el-menu>
</template>

<script>
export default {
  data() {
    return {}
  },
  methods: {},
  created: function () {},
}
</script>

<style scoped="scoped">
.leftNav {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  width: 200px;
  background-color: #2f4056 !important;
  padding-top: 57px;
}
.leftNav .el-menu-item a {
  color: #eee;
  text-decoration: none;
}
.router-link-exact-active.router-link-active {
  font-size: 120%;
  color: #409eff !important;
}
</style>
